<div class="fancy-bg">
<div class="container">

    <div class="position-relative overflow-hidden p-3 p-md-5 m-md-3 text-center">
      <div class="col-md-12 p-lg-5 mx-auto my-5">
        <h1 class="display-4 font-weight-normal"><%= gettext("Next-Gen Live Streaming") %></h1>
        <p class="lead font-weight-normal"><%= gettext("The first live streaming platform built around truly real time interactivity. Our streams are warp speed, our chat is blazing, and our community is thriving. We're launching soon, but you can get your account setup early and learn more about us below!") %></p>
         <%= if @current_user do %>
            <%= link gettext("Edit Your Account"), to: "/users/settings/profile", class: "btn btn-primary btn-lg mt-3" %>
         <% else %>
            <%= link gettext("Register Your Account"), to: Routes.user_registration_path(@socket, :new), class: "btn btn-primary btn-lg mt-3" %>
         <% end %>
     </div>
   </div>
  </div>
</div>

<div class="layout-px-spacing">

    <div class="container">


    <div class="">
      <div class="">
        <div class="row featurette">
          <div class="col-md-6">
            <h2 class="featurette-heading"><%= gettext("Warp Speed Streaming.") %> <br><small class="text-muted"><%= gettext("It's even faster than light.") %></small></h2>
            <p class="lead"><%= gettext("Our fastest streaming technology is built on open standards and gives your streams unimaginable levels of interactivity. We're constantly pushing the boundaries of live video and of course, it's open source.") %></p>
          </div>
          <div class="col-md-6">
            <div class="embed-responsive embed-responsive-16by9">
              <video autoplay muted controls loop class="embed-responsive-item">
                <source src="/videos/features/quick-chat.mp4" type="video/mp4">
              </video>
            </div>
          </div>
        </div>
      </div>
    </div>

    <br><br>
    <hr>
    <br><br>

    <div class="mt-4">
      <div class="">
        <div class="row featurette">
          <div class="col-md-6">
            <img src="/images/dotstorming-community-project.png" alt="" class="img-fluid">
          </div>
          <div class="col-md-6">
            <h2 class="featurette-heading text-right"><%= gettext("Community Driven.") %> <br><small class="text-muted"><%= gettext("Built by the community, for the community.") %></small></h2>
            <p class="lead"><%= gettext("Community is one of our main focuse at Glimesh and we make sure to include you every step of the way. We host staff meetings live on our platform every Tuesday that are open to everyone and if there's a feature you wish we had, you can collaborate on our %{a_start}open source codebase%{a_end} to create it!", a_start: '<a href="https://github.com/Glimesh" target="_blank" class="text-white">', a_end: "<a/>") |> raw() %></p>
          </div>
        </div>
      </div>
    </div>

    <br><br>
    <hr>
    <br><br>


    <div class=" mt-4">
      <div class="">
        <div class="row featurette">
          <div class="col-md-7">
            <h2 class="featurette-heading"><%= gettext("Subscriptions for Everyone.") %> <br><small class="text-muted"><%= gettext("Level the playing field.") %></small></h2>
            <p class="lead"><%= gettext("Subscription buttons shouldn't be restricted for a particular group of streamers. Everyone who can verify their identity and bank information will receive a subscription button for their stream.") %> <br><em><small><%= gettext("For launch, subscriptions will be only be enabled in the US.") %></small></em></p>
          </div>
          <div class="col-md-5 text-right">
            <img src="/images/glimesh-verified.png" alt="" class="" style="max-height: 250px">
          </div>
        </div>
      </div>
    </div>


    <br><br>
    <br><br>


</div>
